<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/style.css">
</head>
<body>
    <!-- head start -->
    <div class="head">
        <div class="allwidth p">
            <img src="images/ceiling-logo2.png" alt="">
            <div class="search"></div>
            <span>搜索</span>
        </div>
    </div>
    <!-- card start -->
    <div class="card" onclick="show()" >
        <a >我的购物车</a>
        <span>(</span>
        <span class="num" id="num">0</span>
        <span>)</span>
    </div>
    <!-- menu start -->
    <div class="menu allwidth" id="allmenu" >
        <div class="food">
            <img src="images/1cde.jpg" alt="" width="100%">
            <div class="n_p">
                <span>A米汉堡</span>
                <span class="price">16元/份</span>
            </div>
            <div class="month">月销8148单</div>
            <div class="time">
                <span>起送￥10</span>
                <span>免配送费</span>
                <span>45分钟</span>
            </div>
            <div class="shop" onclick="add('A米汉堡',16)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/3a31d.jpg" alt="" width="100%">
            <div class="n_p">
                <span>杨记小厨</span>
                <span class="price">17.5元/份</span>
            </div>
            <div class="month">月销4639单</div>
            <div class="time">
                <span>起送￥10</span>
                <span>免配送费</span>
                <span>38分钟</span>
            </div>
            <div class="shop" onclick="add('杨记小厨',17.5)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/9ecd.jpg" alt="" width="100%">
            <div class="n_p">
                <span>杨铭宇黄焖鸡米饭</span>
                <span class="price">18元/份</span>
            </div>
            <div class="month">月销2571单</div>
            <div class="time">
                <span>起送￥10</span>
                <span>免配送费</span>
                <span>25分钟</span>
            </div>
            <div class="shop" onclick="add('杨铭宇黄焖鸡米饭',18)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/d64c553.jpg" alt="" width="100%">
            <div class="n_p">
                <span>烤肉拌饭</span>
                <span class="price">18元/份</span>
            </div>
            <div class="month">月销2347单</div>
            <div class="time">
                <span>起送￥0</span>
                <span>免配送费</span>
                <span>29分钟</span>
            </div>
            <div class="shop" onclick="add('烤肉拌饭',18)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/3d875.jpg" alt="" width="100%" height="202px">
            <div class="n_p">
                <span>有名堂（焗饭、小炒）</span>
                <span class="price">14元/份</span>
            </div>
            <div class="month">月销2156单</div>
            <div class="time">
                <span>起送￥0</span>
                <span>免配送费</span>
                <span>43分钟</span>
            </div>
            <div class="shop" onclick="add('有名堂（焗饭、小炒）',14)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/880259b.jpg" alt="" width="100%">
            <div class="n_p">
                <span>翔仔湾（美食特惠）</span>
                <span class="price">20元/份</span>
            </div>
            <div class="month">月销1803单</div>
            <div class="time">
                <span>起送￥10</span>
                <span>免配送费</span>
                <span>34分钟</span>
            </div>
            <div class="shop" onclick="add('翔仔湾（美食特惠）',20)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/1b718f.jpg" alt="" width="100%">
            <div class="n_p">
                <span>食尚便当</span>
                <span class="price">21元/份</span>
            </div>
            <div class="month">月销3554单</div>
            <div class="time">
                <span>起送￥12</span>
                <span>免配送费</span>
                <span>45分钟</span>
            </div>
            <div class="shop" onclick="add('食尚便当',21)">
                <span>加入购物车</span>
            </div>
        </div>
        <div class="food">
            <img src="images/4c981e4.jpg" alt="" width="100%">
            <div class="n_p">
                <span>格子那只水饺</span>
                <span class="price">13元/份</span>
            </div>
            <div class="month">月销2682单</div>
            <div class="time">
                <span>起送￥10</span>
                <span>免配送费</span>
                <span>23分钟</span>
            </div>
            <div class="shop" onclick="add('格子那只水饺',13)">
                <span>加入购物车</span>
            </div>
        </div>

    </div>
    <!-- 购物车 -->
    <div id="shopcart" class="shopCart allwidth" style="display: none;">
        <table id="list">
            <thead>
                <th >
                    <label for="ch">全选</label>
                    <input type="checkbox"  id="all" onchange="allchoose(this)" >
                </th>
                <th>菜品</th>
                <th>价格（元/份）</th>
                <th>数量</th>
                <th>操作</th>
            </thead>
            <tbody id="listBody">

            </tbody>
        </table>
        <ul class="account">
            <li>
                <input id="deleteall" type="button" value="删除选中" onclick="chDel()">
            </li>
            <li>
                <span>合计 ￥</span>
                <span id="money"></span>
                <input id="sum" type="button" value="结算" onclick="sum()">
            </li>
        </ul>
        <p id="null">购物车空了</p>
        <a class="continue" onclick="ct()">继续任意点餐</a>
    </div>
    
    <script src="./js/index.js"></script>
</body>
</html>